<template>
    <picker mode="region" :value="region" @change="changeRegin">
        <view class="uni-input" v-if="region.length > 0">{{ region[0] }} - {{ region[1] }} - {{ region[2] }} </view>
        <view class="uni-input" v-else style="color: #ccc">请选择所在地区</view>
    </picker>
</template>

<script>
export default {
    props: {
        data: {
            // 数据
            type: String,
        },
        index: {
            type: Number,
            default: 0,
        },
    },
    data() {
        return {
            region: [],
        }
    },
    mounted() {
        console.log(123)
        console.log(this.data)
        if (this.data) {
            this.region = this.data.split(",")
        }
    },
    methods: {
        changeRegin(e) {
            console.log(e)
            this.region = e.detail.value
            this.$emit("changeRegin", this.index, this.region)
        },
    },
}
</script>

<style lang="scss">
.checkmain {
    display: flex;
    flex-wrap: wrap;

    label {
        display: flex;
        width: 50%;

        view {
            white-space: nowrap;
        }
    }
}
</style>
